<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="{$_G['addon_url']}/Public/css/weui.css" />
    <link rel="stylesheet" type="text/css" href="{$_G['addon_url']}/Public/css/weui2.css" />
    <link rel="stylesheet" type="text/css" href="{$_G['addon_url']}/Public/css/weui3.css" />
    <link rel="stylesheet" type="text/css" href="{$_G['addon_url']}/Public/css/yonghu.css" />
    <script src="{$_G['addon_url']}/Public/js/zepto.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        $(function() {
            $('.js-category').click(function() {
                $parent = $(this).parent('li');
                if($parent.hasClass('js-show')) {
                    $parent.removeClass('js-show');
                    $(this).children('i').removeClass('icon-35').addClass('icon-74');
                } else {
                    $parent.siblings().removeClass('js-show');
                    $parent.addClass('js-show');
                    $(this).children('i').removeClass('icon-74').addClass('icon-35');
                    $parent.siblings().find('i').removeClass('icon-35').addClass('icon-74');
                }
            });

        });
    </script>
    <title></title>
    <style type="text/css">
        .nimabi {
            padding: 28px 0px;
        }

        .weui-header-left a.icon {
            font-size: 1.1em;
            color: #FFFFFF;
        }

        .weui_cells_access .weui_cell:not(.no_access):active {
            background-color: #FFFFFF;
        }

        .weui_panel {
            background-color: #fff;
            /* margin-top: 59px; */
            position: relative;
            overflow: hidden;
            width: 100%;
            border-radius: 0px;
            /*border: none;*/
        }

        .weui_switch:checked {
            border-color: #ff6a6e;
            background-color: #ff6a6e;
        }

        .weui_cell_switch {
            padding-top: 9px;
            padding-bottom: 9px;
        }

        .weui-header-right .icon-36 {
            font-size: 1.4em;
        }
        .page-bd{
            margin-bottom: 40px;
        }
        .page-bd .weui-flex {
            background: #ffffff;
        }

        .weui_cell {
            background: #FFFFFF;
        }

        .weui_cells {
            background: #F9F9F9;
            font-size: 1em;
        }
        .fabu{
            width: 85%;
            margin: 0 7%;
            padding: 0px 0px;
        }
        .weui_btn_warn:not(.weui_btn_disabled):active {
            color: hsla(0, 0%, 100%, .4);
            background-color: #d42525;
        }
    </style>
</head>

<body>
<div class="weui-header bg-orange" style="padding: 3px 0;">
    <div class="weui-header-left">
        <a class="icon icon-109 f-white" href="{:create_mobile_url('userCenter')}">返回</a>
    </div>
    <h1 class="weui-header-title">我的关注</h1>
    <!-- <div class="weui-header-right">
        <a class="icon icon-36 f-white"></a>
    </div> -->
</div>

<!-- <div class="weui_panel_bd">
    <div class="nimabi">
        <div class="haha">
            <img src="img/touxiang.jpg">
        </div>

        <span class="name">楼上小黑</span>
    </div>
</div> -->
<!-- <div class="weui_cells_title">欢迎使用本产品，请选择关注分类<br/>有更新将即时通知你！</div> -->
<div class="page-bd">

    <div class="weui_cells weui_cells_access" >
        <a class="weui_cell" href="javascript:;">
            <div class="weui_cell_bd weui_cell_primary">
                <p>关注</p>
            </div>
            <input class="weui_switch" type="checkbox" id="switch" <if condition="$types != -1">checked</if> />
        </a>
    </div>
    <ul <if condition="$types == -1"> style="display:none"   </if>id="ul">

    <form action="" method="post">
        <volist name="typeList" id="val">

            <li class="">
                <div class="weui-flex js-category">
                    <p class="weui-flex-item">{$key}</p>
                    <i class="icon icon-74"></i>
                </div>
                <div class="page-category js-categoryInner">

                    <div class="weui_cells weui_cells_access" style="margin-top: 0px;">
                        <volist name="val" id="v">
                            <a class="weui_cell" href="javascript:;">
                                <div class="weui_cell_bd weui_cell_primary">
                                    <p>{$v['type_name']}</p>
                                </div>
                                <input class="weui_switch s" type="checkbox" name="type_val" value="{$v['id']}" <?php if(in_array($v['id'],$types)) echo checked; ?>>
                            </a>
                        </volist>
                    </div>

                </div>
            </li>
        </volist>
</form>

        </ul>
</div>
<a href="javascript:void(0);" id="ok" class="weui_btn weui_btn_warn fabu">确定</a>
<script>
    $("#ok").click(function(){
        var url = $('form').attr('action');
        var type_list = '';
        var is_guan = 0;
        $('.s').each(function() {
            if ($(this).prop('checked') ==true) {
                type_list+=$(this).val()+",";
            }
        });
        if($('#switch').prop('checked') == true){
            is_guan = 1;
            if(!type_list){
                $.toast("请选择分类", "forbidden");
                return false;
            }
        }

        $.ajax({
            url:url,
            type:"post",
            dataType:"json",
            data:{'types':type_list,'is_guan':is_guan},
            success:function(data){
                console.log(data);
                if (data.status == 1) {
                    $.toast(data.info);
                    setTimeout(function(){
                        location.href = data.url;
                    },1500);
                } else {
                    $.toast(data.info, "forbidden");
                }
            },
            error:function(){
                $.toast("错误", "forbidden");
            }
        });

        return false;
    });
</script>
<script type="text/javascript">
    $("#switch").click(function(){
        if($("#switch").prop('checked') ==true){
            $("#ul").show();
        }else{
            $("#ul").hide();
        }
    });
</script>
</body>

</html>